<div class="img-picker">
  @if (formControl.value) {
    <div class="meta mt-3 flex flex-row justify-start items-center">
      <img src="{{ src }}" alt="" />
      <div class="content flex flex-col">
        <div class="title">{{ field.props?.fileName }}</div>
        <div class="desc">{{ field.props?.alt }}</div>
      </div>
    </div>
  }
  <div class="actions my-3 flex justify-center items-center gap-3">
    @if (formControl.value) {
      <app-btn (click)="remove()" [content]="{ label: to.deleteLabel, color: 'warn' }" />
    }
    <app-btn
      (click)="openMedias()"
      [content]="{
        label: formControl.value ? to.updateLabel : to.addLabel,
        color: to.color || 'primary',
        mode: to.mode || 'stroked',
      }"
    />
  </div>
</div>
